// 官方介绍：生成随机数据，拦截 Ajax 请求
import Mock, { Random } from 'mockjs'
import qs from 'qs'
// 官方用法示例：http://mockjs.com/examples.html

// mock的配置
Mock.setup({
  // 随机延时 500-1000 毫秒
  timeout: '500-1000'
})

// 拦截请求
// 第一个参数：url，使用正则去匹配
// 第二个参数：请求方式
// 第三个参数： 生成数据的函数
Mock.mock(/\/my\/test/, 'get', () => {
  return {
    msg: '请求测试接口成功',
    code: 200,
    result: [
      {
        id: Random.id(), // 随机 id
        name: Random.ctitle(10, 15), // 随机 10-15 个中文
        desc: Random.ctitle(15, 25), // 随机 15-25 个中文
        price: Random.float(60, 100, 2, 2), // 随机 60-10 保留两位小数
        picture: Random.image('200x200') // 200x200 的图片
      }
    ]
  }
})

// 模拟：获取收藏接口 - 参数字段按接口文档来定义
// 接口文档：https://megasu.gitee.io/erabbit-client-pc-document/api#u83b7u53d6u6536u85cf0a3ca20id3du83b7u53d6u6536u85cf3e203ca3e
Mock.mock(/\/member\/collect/, 'get', ({ body, url }) => {
  // GET 请求参数从 url 中提取，请求体中的数据可以在 body 参数中提取
  const queryString = url.split('?')[1]
  // 解构出请求参数
  const { pageSize, page } = qs.parse(queryString)
  // console.log({ pageSize, page })
  // 🔔 Mock.mock({})  内部支持数据模板定义
  return Mock.mock({
    msg: '操作成功',
    result: {
      counts: 35,
      pages: 4, // 总页数
      pageSize: Number(pageSize), // 页容量
      page: Number(page), // 当前页
      // 🔔 数据模板定义高级语法
      ['items|' + pageSize]: [
        {
          id: '@id()',
          name: '@ctitle(10, 15)',
          description: '@ctitle(20, 25)',
          picture: "@dataImage('200x200')",
          collectType: '@integer(1, 3)',
          price: '@float(1, 500, 2, 2)',
          discount: '@float(0, 1, 1, 1)',
          productionPlace: '@province()',
          detailsUrl: '@url()'
        }
      ]
    }
  })
})
